<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>主界面</title>
    <style>
        #box {
            margin: 0 auto;
            text-align: center;
        }

        h2 {
            text-align: center;
        }

        table {
            margin: 0 auto;
            text-align: center;
        }
    </style>
</head>
<body>
<h2>园区门禁管理系统</h2>
<div id="box">
    <form action="list" method="post">
        <select name="building_id" id="bb">
            <option value="">--请选择--</option>
        </select>
        <input type="button" onclick="mySearch()" value="查询">
        <input type="button" onclick="add()" value="添加">
        <table border="1">
            <tr>
                <td>负责人</td>
                <td>供货商</td>
                <td>品牌</td>
                <td>所属楼宇</td>
                <td>安装日期</td>
                <td>运行状态</td>
                <td>操作</td>
            </tr>

            <c:forEach items="${all}" var="concert">
                <tr>
                    <td>${concert.principal}</td>
                    <td>${concert.supplier}</td>
                    <td>${concert.brand}</td>
                    <td>
                        <c:if test="${concert.buildingId==1}">
                            <c:out value="北京花胜天成科研大楼">
                            </c:out>
                        </c:if>
                        <c:if test="${concert.buildingId==2}">
                            <c:out value="软通动力大厦">
                            </c:out>
                        </c:if>
                        <c:if test="${concert.buildingId==3}">
                            <c:out value="新浪总部大厦">
                            </c:out>
                        </c:if>
                        <c:if test="${concert.buildingId==4}">
                            <c:out value="首农蓝海中心">
                            </c:out>
                        </c:if>
                        <c:if test="${concert.buildingId==5}">
                            <c:out value="博彦科技大厦">
                            </c:out>
                        </c:if>
                        <c:if test="${concert.buildingId==6}">
                            <c:out value="中兴通大厦">
                            </c:out>
                        </c:if>
                    </td>
                    <td>${concert.addTime}</td>
                    <td>
                        <c:if test="${concert.status==1}">
                            <c:out value="启用">
                            </c:out>
                        </c:if>
                        <c:if test="${concert.status==0}">
                            <c:out value="停用">
                            </c:out>
                        </c:if>
                    </td>
                    <td>
                        <c:if test="${concert.status==1}">
                            <a href="javascript:void(0)" onclick="Deactivated(${concert.id})">停用</a>
                        </c:if>
                        <c:if test="${concert.status==0}">
                            <a href="javascript:void(0)" onclick="enable(${concert.id})">启用</a>
                        </c:if>
                    </td>
                </tr>

            </c:forEach>

        </table>

        <p>
            <a href="list?pageIndex=1">首页</a>
            <a href="javaScript:void(0)" onclick="begin()">上一页</a>
            <a href="javaScript:void(0)" onclick="end()">下一页</a>
            <a href="javaScript:void(0)" onclick="last()">尾页</a>

            <span>第${pageIndex}页,共${pageCount}页,总记录数${count}条</span>
        </p>
    </form>
</div>


<script src="js/jquery.min.js"></script>
<script>

    $(function (){
        initBuildings();
        // let selected = getParam("selected");
        // if(selected){
        //     $("#bb").val(selected);
        // }
    })
    let buildings;

    let selectedValue;
    $("#bb").change(function(){
        selectedValue = $(this).val();
    })
    function option() {
        let select = $("#bb");
        for (let i = 0; i < buildings.length; i++) {
            let id = buildings[i].id;
            let name = buildings[i].name;
            select.append(`<option value="\${id}">\${name}</option>`)
        }
    }

    // function getParam(name) {
    //     let params = new URLSearchParams(location.search);
    //     return params.get(name);
    // }
    function initBuildings(){
        $.post("building",function (response){
            buildings = response;
            option();
        },"json")
    }
    function Deactivated(id){
        $.post("update",{status:0,id:id},function (data){
            if(parseInt(data)>0){
                alert("禁用成功")
                location.reload()
            }else{
                alert("禁用失败")
            }
        })
    }

    function enable(id){
        $.post("update",{status:1,id:id},function (data){
            if(parseInt(data)>0){
                alert("启用成功")
                location.reload()
            }else{
                alert("启用失败")
            }
        })
    }

    function mySearch(){
        let val = $("#bb").val();
        location.href="list?buildingId="+val+"&selected="+selectedValue;
    }

    function add() {
        location.href = 'add.jsp';
    }

    function begin() {
        let pageIndex = parseInt(${pageIndex});
        if (pageIndex <= 1) {
            alert("已是首页！");
            return;
        }

        location.href = 'list?pageIndex=' + (pageIndex - 1);
    }

    function end() {
        let pageIndex = parseInt(${pageIndex});
        let pageCount = parseInt(${pageCount});
        if (pageIndex >= pageCount) {
            alert("已是尾页！");
            return;
        }

        location.href = 'list?pageIndex=' + (pageIndex + 1);
    }

    function last() {
        let pageCount = parseInt(${pageCount});
        location.href = 'list?pageIndex=' + pageCount;
    }
</script>

</body>
</html>
